<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:a4j="http://richfaces.org/a4j"
	xmlns:rich="http://richfaces.org/rich">

<ui:composition
	template="/WEB-INF/facelets/templates/templateGrupo.xhtml">
	<ui:define name="content">
		<h3 align="center" style="color: #FF9900">CRONOGRAMA DE</h3>
		<h3 align="center" style="color: #FF9900">ACTIVIDADES</h3>
		<br />

		<h:form>
			<a4j:region>
				<rich:dataTable value="#{grupoBean.listaActividades}"
					id="tablaActividades" var="actividad"
					binding="#{grupoBean.tablaActividad}" align="center">
					<f:facet name="header">
						<h:outputText value="Cronograma de Actividades" />
					</f:facet>
					<rich:column>
						<f:facet name="header">
							<h:outputText value="Nº" />
						</f:facet>
						<h:outputText value="#{actividad.identificacion}"
							id="identificacion" />
					</rich:column>
					<rich:column>
						<f:facet name="header">
							<h:outputText value="Actividad" />
						</f:facet>
						<h:outputFormat value="#{actividad.actividad}" id="actividad" />
					</rich:column>
					<rich:column>
						<f:facet name="header">
							<h:outputFormat value="Herramienta" />
						</f:facet>
						<h:outputText value="#{actividad.herramienta}" id="herramienta" />
					</rich:column>
					<rich:column>
						<f:facet name="header">
							<h:outputText value="Tiempo" />
						</f:facet>
						<h:outputText value="#{actividad.tiempo}" id="tiempo" />
					</rich:column>
					<rich:column>
						<f:facet name="header">
							<h:outputText value="Responsable" />
						</f:facet>
						<h:outputText value="#{actividad.responsabilidad}"
							id="responsable" />
					</rich:column>
					<rich:column>
						<f:facet name="header">
							<h:outputText value="Editar" />
						</f:facet>
						<a4j:commandLink action="#{grupoBean.obtenerActividadEditar}"
							id="editarLink"
							oncomplete="#{rich:component('editPanel')}.show()">
							Editar<h:graphicImage value="/images/icons/edit.jpg" />
						</a4j:commandLink>
						<rich:toolTip for="editarLink" value="Editar" />
					</rich:column>
				</rich:dataTable>
			</a4j:region>
			<br />
			<br />
			<a4j:commandLink oncomplete="#{rich:component('newPanel')}.show()" id="nuevo">
				<h:outputText value="Crear nueva actividad" style="font-size: 18px; align: center"/>
			</a4j:commandLink>
			<rich:toolTip for="nuevo" value="Click para crear una nueva actividad"></rich:toolTip>
		</h:form>


		<rich:modalPanel id="newPanel" autosized="true" width="450"
			style="background-color:white;">
			<f:facet name="header">
				<h:outputText value="Nueva Actividad" />
			</f:facet>
			<f:facet name="controls">
				<h:panelGroup>
					<h:graphicImage value="/images/icons/close.jpg" id="hidelink"
						styleClass="hidelink" />
					<rich:componentControl for="newPanel" attachTo="hidelink"
						operation="hide" event="onclick" />
				</h:panelGroup>
			</f:facet>
			<h:form>
				<h:panelGrid columns="1">
					<a4j:outputPanel ajaxRendered="true">
						<h:panelGrid columns="4">
							<h:outputText value="Actividad" />
							<h:outputText value="Herramienta" />
							<h:outputText value="Tiempo" />
							<h:outputText value="Responsable" />

							<h:inputTextarea cols="12"
								value="#{grupoBean.nuevaActividad.actividad}" id="actividad"
								validatorMessage="Error de Validación: Valor es más grande de valor de máximo permitido: '512'."
								required="true" requiredMessage="Dato Requerido">
								<f:validateLength maximum="512" />
								<rich:ajaxValidator event="onblur" />
							</h:inputTextarea>

							<h:inputTextarea cols="12"
								value="#{grupoBean.nuevaActividad.herramienta}" id="herramienta"
								validatorMessage="Error de Validación: Valor es más grande de valor de máximo permitido: '512'."
								required="true" requiredMessage="Dato Requerido">
								<f:validateLength maximum="512" />
								<rich:ajaxValidator event="onblur" />
							</h:inputTextarea>

							<h:inputTextarea cols="12"
								value="#{grupoBean.nuevaActividad.tiempo}" id="tiempo"
								validatorMessage="Error de Validación: Valor es más grande de valor de máximo permitido: '512'."
								required="true" requiredMessage="Dato Requerido">
								<f:validateLength maximum="512" />
								<rich:ajaxValidator event="onblur" />
							</h:inputTextarea>

							<h:inputTextarea cols="12"
								value="#{grupoBean.nuevaActividad.responsabilidad}"
								id="responsable"
								validatorMessage="Error de Validación: Valor es más grande de valor de máximo permitido: '512'."
								required="true" requiredMessage="Dato Requerido">
								<f:validateLength maximum="512" />
								<rich:ajaxValidator event="onblur" />
							</h:inputTextarea>

							<rich:message for="actividad" style="color:red;">
								<f:facet name="errorMarker">
									<h:graphicImage value="/images/icons/error.jpg" />
								</f:facet>
							</rich:message>

							<rich:message for="herramienta" style="color:red;">
								<f:facet name="errorMarker">
									<h:graphicImage value="/images/icons/error.jpg" />
								</f:facet>
							</rich:message>

							<rich:message for="tiempo" style="color:red;">
								<f:facet name="errorMarker">
									<h:graphicImage value="/images/icons/error.jpg" />
								</f:facet>
							</rich:message>

							<rich:message for="responsable" style="color:red;">
								<f:facet name="errorMarker">
									<h:graphicImage value="/images/icons/error.jpg" />
								</f:facet>
							</rich:message>
						</h:panelGrid>

					</a4j:outputPanel>
					<a4j:commandButton value="Guardar"
						action="#{grupoBean.crearActividad}" reRender="tablaActividades"
						oncomplete="if (#{facesContext.maximumSeverity==null}) #{rich:component('newPanel')}.hide();"
						style="width: 104px; height: 29px; " />
				</h:panelGrid>
			</h:form>
		</rich:modalPanel>


		<rich:modalPanel id="editPanel" autosized="true" width="450"
			style="background-color:white;">
			<f:facet name="header">
				<h:outputText value="Editar la Institucion Actual" />
			</f:facet>
			<f:facet name="controls">
				<h:panelGroup>
					<h:graphicImage value="/images/icons/close.jpg" id="hidelink1"
						styleClass="hidelink" />
					<rich:componentControl for="editPanel" attachTo="hidelink1"
						operation="hide" event="onclick" />
				</h:panelGroup>
			</f:facet>
			<h:form>
				<h:panelGrid columns="1">
					<a4j:outputPanel ajaxRendered="true">
						<h:panelGrid columns="4">
							<h:outputText value="Actividad" />
							<h:outputText value="Herramienta" />
							<h:outputText value="Tiempo" />
							<h:outputText value="Responsable" />

							<h:outputText cols="12"
								value="#{grupoBean.actividadSeleccionada.actividad}"
								id="actividadE">
							</h:outputText>

							<h:inputTextarea cols="12"
								value="#{grupoBean.actividadSeleccionada.herramienta}"
								id="herramientaE"
								validatorMessage="Error de Validación: Valor es más grande de valor de máximo permitido: '512'."
								required="true" requiredMessage="Dato Requerido">
								<f:validateLength maximum="512" />
								<rich:ajaxValidator event="onblur" />
							</h:inputTextarea>

							<h:inputTextarea cols="12"
								value="#{grupoBean.actividadSeleccionada.tiempo}" id="tiempoE"
								validatorMessage="Error de Validación: Valor es más grande de valor de máximo permitido: '512'."
								required="true" requiredMessage="Dato Requerido">
								<f:validateLength maximum="512" />
								<rich:ajaxValidator event="onblur" />
							</h:inputTextarea>

							<h:inputTextarea cols="12"
								value="#{grupoBean.actividadSeleccionada.responsabilidad}"
								id="responsableE"
								validatorMessage="Error de Validación: Valor es más grande de valor de máximo permitido: '512'."
								required="true" requiredMessage="Dato Requerido">
								<f:validateLength maximum="512" />
								<rich:ajaxValidator event="onblur" />
							</h:inputTextarea>

							<rich:message for="actividadE" style="color:red;">
								<f:facet name="errorMarker">
									<h:graphicImage value="/images/icons/error.jpg" />
								</f:facet>
							</rich:message>

							<rich:message for="herramientaE" style="color:red;">
								<f:facet name="errorMarker">
									<h:graphicImage value="/images/icons/error.jpg" />
								</f:facet>
							</rich:message>

							<rich:message for="tiempoE" style="color:red;">
								<f:facet name="errorMarker">
									<h:graphicImage value="/images/icons/error.jpg" />
								</f:facet>
							</rich:message>

							<rich:message for="responsableE" style="color:red;">
								<f:facet name="errorMarker">
									<h:graphicImage value="/images/icons/error.jpg" />
								</f:facet>
							</rich:message>
						</h:panelGrid>
					</a4j:outputPanel>
					<a4j:commandButton value="Guardar"
						action="#{grupoBean.editarActividad}" reRender="tablaActividades"
						oncomplete="if (#{facesContext.maximumSeverity==null}) #{rich:component('editPanel')}.hide();"
						style="width: 104px; height: 29px; " />
				</h:panelGrid>
			</h:form>
		</rich:modalPanel>

	</ui:define>
	<ui:define name="menu">
		<a4j:form>
			<ul class="menu">
				<li class="item174"><a href="grupoIni.jsf"> <span>Atras</span>
				</a>
				</li>
			</ul>
		</a4j:form>
	</ui:define>
</ui:composition>
</html>